<template>
    <div ref="BookPage" class="all">
      MommySchoolCourse
    </div>
</template>

<script>
    export default {
        name: "MommySchoolCourse",
      data(){
          return{
            clientHeight: '',
          }
      },
      methods: {
        changeFixed(clientHeight) {
          this.$refs.BookPage.style.height = clientHeight + 'px';
        },
      },
      mounted() {
        // 获取浏览器可视区域高度
        this.clientHeight =   `${document.documentElement.clientHeight}`;          //document.body.clientWidth;
        //console.log(self.clientHeight);
        window.onresize = function temp() {
          this.clientHeight = `${document.documentElement.clientHeight}`;
        };
      },
      watch: {
        // 如果 `clientHeight` 发生改变，这个函数就会运行
        clientHeight: function () {
          this.changeFixed(this.clientHeight)
        }
      },
    }
</script>

<style scoped>
  .all{
    width: 100%;
    height: auto;
    overflow-x: hidden;
    background: blueviolet;
    color:white;
  }

</style>
